<!--菜单-->
<template>
  <div class="menu_box">
    <el-menu default-active="topic">
      <el-menu-item index="topic">文档概述</el-menu-item>
      <el-submenu index="table">
        <template slot="title">
          <span>项目列表</span>
        </template>
        <el-menu-item-group title="Vue项目">
          <template slot="title">Vue项目</template>
          <el-menu-item index="v1">单页面应用</el-menu-item>
          <el-menu-item index="v2">服务端渲染</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="React项目">
          <el-menu-item index="r1">单页面应用</el-menu-item>
          <el-menu-item index="r2">服务端渲染</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="Html项目">
          <el-menu-item index="h1">Boostrap开发</el-menu-item>
          <el-menu-item index="h2">Layui开发</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="移动端">
          <el-menu-item index="app1">微信小程序</el-menu-item>
          <el-menu-item index="app2">公众号</el-menu-item>
          <el-menu-item index="app3">H5应用</el-menu-item>
          <el-menu-item index="app4">大数据可视化平台</el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-menu-item index="problem">常见问题</el-menu-item>
      <el-menu-item index="online">在线支持</el-menu-item>
      <el-menu-item index="special">特殊定制</el-menu-item>
    </el-menu>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
  methods: {},
};
</script>
<style lang="scss" scoped>
.menu_box {
  .el-menu {
    border: none;
    > .el-menu-item {
      font-size: 16px;
      font-weight: 600;
    }
    > .el-submenu /deep/ {
      .el-submenu__title {
        font-size: 16px;
        font-weight: 600;
      }
    }
  }
}
</style>